<template>

	<view class="content">

		<image class="logo" src="/static/logo.png"></image>

		<view class="">
			<text class="title">{{title}}</text>
		</view>
		<view class="content">
			{{content}}
		</view>

		<view class="">
			<image :src="img_str" mode="widthFix"></image>
			
			<text>{{tv_info}}</text>
		</view>
		<view>
			<text>{{m_FristPFInfo}}</text>
		</view>
		<view>
			<text>{{m_SecondPFInfo}}</text>
		</view>
		<button @click="conn">连接OTG</button>
		<button @click="read">读卡OTG</button>
		<button @click="autoRead">自动读卡OTG</button>

	</view>

</template>



<script>
	export default {

		data() {

			return {

				title: '火一五信息科技有限公司',

				otg: null,
				content: '你好',
				img_str: "",
				tv_info: "",
				m_FristPFInfo: "",
				m_SecondPFInfo: "",

			}

		},

		onLoad() {

			this.otg = uni.requireNativePlugin('Huo15Otg')

			var globalEvent = uni.requireNativePlugin('globalEvent');

			globalEvent.addEventListener('myEvent', (e) => {
				
				this.img_str = e.img_str
				// this.img_str=this.img_str.replace(/\ +/g,"");  
				// this.img_str=this.img_str.replace(/[\r\n]/g,"");  
				console.log("huo15test:", this.img_str );
				this.tv_info = e.tv_info
				this.m_FristPFInfo = e.m_FristPFInfo
				this.m_SecondPFInfo = m_SecondPFInfo
				console.log("huo15test:", JSON.stringify(e));


			});



		},

		methods: {
			conn() {
				console.log('huo15test:', this.otg.connOtg);
				try{
					this.otg.connOtg(res => {
						//res={is_conn:true,msg:"这里是消息"}
						console.log('huo15test:', res, typeof res, res.msg);
						this.content = res.msg
					});
				}catch(e){
					console.log('err',e);
				}
				



			},
			read() {
				this.otg.read(res => {
					console.log('huo15test:', res, typeof res, res.msg);
					this.content = res
				})
			},
			autoRead() {
				this.otg.autoRead(res => {
					console.log('huo15test:', res, typeof res, res.msg);
					this.content = res
				})
			},

		}

	}
</script>



<style>
	.content {
		width:750rpx;
		display: flex;

		flex-direction: column;

		align-items: center;

		justify-content: center;

	}



	.logo {

		height: 200rpx;

		width: 200rpx;

		margin-top: 200rpx;

		margin-left: auto;

		margin-right: auto;

		margin-bottom: 50rpx;

	}



	.text-area {

		display: flex;

		justify-content: center;

	}



	.title {

		font-size: 36rpx;

		color: #8f8f94;

	}
</style>